<template>
    <div>
        <div id="first">
            <div class="first-content">
                <span class="fa fa-check-circle-o first-span"></span>
                <span>全场商品90天保价</span>
            </div>
            <div class="first-content">
                <span class="fa fa-check-circle-o first-span"></span>
                <span>30天无忧退换货</span>
            </div>
            <div class="first-content">
                <span class="fa fa-check-circle-o first-span"></span>
                <span>满59元免运费</span>
            </div>
        </div>

        <div id="second">
            <div v-for="i in imgs2" >
                <img :src="i.img" alt="">
            </div>
        </div>
        
        <div id="third">
            <p>8大热销茶叶品类</p>
            <span>总有你想不到的低价</span>
            <div v-for="i in imgs3">
                <img :src="i.img" alt="">
            </div>
        </div>
        
    </div>
</template>

<script>
import {mapState} from 'vuex'
export default {
    computed:{
        ...mapState([
            "imgs2",
            "imgs3"
        ])
    },
}
</script>

<style scoped>
    #first{
        height: 5vh;
        line-height: 5vh;
        display: flex;
        background-color: white;
        justify-content: space-around;
        /*padding-left: 3vw;*/
    }
    .first-content{
        font-size: 3.5vw;
        color: grey;
    }
    .first-span{
        color: #ee9572;
    }
    #second{
        margin-top: 1vh;
        background-color: white;
        width: 100%;
        padding-top: 1vh;
        display: flex;
        justify-content: space-around;
    }
    #second img{
        width: 45vw;
    }
    #third{
        width: 100vw;
        background-color: white;
        margin-top: 1vh;
        padding-top: 2vh;
    }
    #third p{
        margin: 0;
        font-size: 5vw;
        text-align: center;
    }
    #third span{
        margin-top: 1vh;
        display: block;
        font-size: 4vw;
        text-align: center;
        color: grey;
        margin-bottom: 2vh;
    }
    #third img{
        width: 100vw;
    }
</style>